<template>
  <div>
    <div class="header">
      <div>
        <label>供应商名称：</label>
        <el-input style="width: 280px" size="small" placeholder="请输入供应商名称" v-model.trim="name"> </el-input>
        <el-button style="margin-left: 10px" size="small" type="primary" class="commonBtn1" @click="searchBtn"
          >搜索</el-button
        >
      </div>
      <div v-if="btnshow">
        <el-button size="small" class="commonBtn" @click="cancelBtn">取消</el-button>
        <el-button size="small" type="primary" @click="subBtn" class="commonBtn1">确定</el-button>
      </div>
    </div>
    <div class="tables" style="margin-top: 20px">
      <el-table
        :data="tableData"
        border
        class="inventory_table"
        ref="personTable"
        :header-cell-style="{ padding: '0px', background: '#F2F3F7' }"
        :row-class-name="tabRowClassName"
        @selection-change="handleSelectionChange"
      >
        <!-- @select="handleSelect"
        @select-all="selectAll" -->
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column width="60" align="center" type="index" :index="addIndex" label="序号"></el-table-column>
        <el-table-column align="center" label="供应商名称" prop="enterpriseName"></el-table-column>
        <el-table-column align="center" label="主营物资" prop="materialType"></el-table-column>
        <el-table-column align="center" label="综合评价" prop="comprehensiveScore"></el-table-column>
        <el-table-column align="center" label="业务联系人" prop="contacts"></el-table-column>
        <el-table-column align="center" label="联系人手机号" prop="phone"></el-table-column>
      </el-table>
    </div>
    <div class="pags">
      <element-pagination :Total="total" @getData="getPagChange"></element-pagination>
    </div>
  </div>
</template>

<script>
import ElementPagination from '../../../components/ElementPagination.vue'
export default {
  components: { ElementPagination },
  props: {
    list: {
      type: Array
    },
    btnshow: {
      type: Boolean
    },
    smsNum: {
      type: [Object, Number, String],
      default: null
    }
  },
  data() {
    return {
      tableData: [],
      selectList: [],
      Selected: [],
      name: '',
      num: this.smsNum,
      total: 0,
      page: 1,
      size: 15
    }
  },
  mounted() {
    this.setSelected()
    this.getData()
  },
  methods: {
    setSelected() {
      let arr = []
      this.list.forEach(item => {
        arr.push(item.enterpriseId)
      })
      this.Selected = arr
    },
    // handleSelect(selection, row) {
    //   console.log(selection);
    //   if (selection.length > 1) {
    //     let del_row = selection.shift();
    //     this.$refs.personTable.toggleRowSelection(del_row, false);
    //   }
    // },
    handleSelectionChange(e) {
      this.selectList = e
    },
    // selectAll(selection) {
    //   console.log(selection);
    //   this.$refs.personTable.clearSelection();
    //   if (selection.length > 1) {
    //     selection.length = 1;
    //   }
    // },
    searchBtn() {
      this.getData()
    },
    cancelBtn() {
      this.$emit('close', '')
    },
    subBtn() {
      if (this.selectList.length == 0) {
        this.$message.error('请选择供应商')
      } else {
        this.$emit('close', this.selectList)
      }
    },
    getPagChange(data) {
      this.page = data.currentPage
      this.size = data.pagesize
      this.getData()
    },
    getData() {
      this.$https({
        url: '/government/listAllMaterialEnterprise',
        method: 'post',
        data: {
          nameLike: this.name,
          page: this.page,
          size: this.size,
          smsNum: +this.num,
          beSelectedEnterpriseIdList: this.Selected
        }
      })
        .then(res => {
          if (res.code === 0) {
            this.total = res.data.total
            this.tableData = res.data.records
            this.selectList.forEach(element => {
              this.tableData.forEach(item => {
                if (item.id == element.id) {
                  this.$refs.personTable.toggleRowSelection(item, true)
                }
              })
            })
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    addIndex(index) {
      return index + 1 + (this.page - 1) * this.size
    },
    tabRowClassName({ row, rowIndex }) {
      let index = rowIndex + 1
      if (index % 2 == 0) {
        return 'warning-row'
      }
    }
  }
}
</script>
<style lang="less" scoped>
.header {
  display: flex;
  justify-content: space-between;
}
</style>
